<!--  -->
<template>
       <van-form @submit="changeFromData">
        
        <div class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;">
            <div class="blue_item"></div>
            <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">商机基本信息</span>
        </div> 
        <van-field readonly required name="city" :value="fromdata.city" label="地市:" label-width="3em" />
        <van-field readonly required name="county" :value="fromdata.county" label="县区:" label-width="3em" />
        <van-field readonly required name="businessId" :value="fromdata.businessId" label="商机编码:" label-width="5em" />
        <van-field readonly required name="clueName" :value="fromdata.clueName" label="线索名称:" label-width="5em" />
        <van-field readonly required name="businessName" :value="fromdata.businessName" label="商机名称:" label-width="5em" />
        <van-field readonly required name="customerCode" :value="fromdata.customerCode" label="集团客户编码:" label-width="7em" />
        <van-field readonly required name="customerName" :value="fromdata.customerName" label="集团客户名称:" label-width="7em" />
        <van-field readonly required name="industryType" :value="fromdata.industryType" label="客户行业:" label-width="5em" />
        <van-field readonly required autosize type="textarea" rows="1" name="projectDesc" :value="fromdata.projectDesc" label="商机描述:" label-width="5em"/>
        <van-field readonly required name="busiOpportSource" :value="getKeyFromDictionaryByValue(fromdata.busiOpportSource,busiOpportSource)" 
        label="商机来源:" label-width="5em" right-icon='arrow' @click="showPop=true"/>
        <van-field readonly required name="preAmount" :value="fromdata.preAmount" label="预估金额（万元）:" label-width="9em" />
      
        <div  class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;padding-right:5px;">
          <div class="blue_item"></div>
          <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">客户侧</span>
          <van-button  block type="info" style="display: inline-block;width:auto;height: 33px;" native-type="button" @click="choseZTNL(1,'客户侧')">新增</van-button>
        </div> 
        <el-table  :data="customerSideTable" border style="width: 100%">
          <el-table-column prop="modifier" label="维护人"/>
          <el-table-column prop="modifiedTime" label="维护时间"/>
          <el-table-column prop="roleNew" label="岗位角色"/>
          <el-table-column prop="customerSpecialName" label="联系人姓名"/>
          <el-table-column prop="customerSpecialPhone" label="联系人方式"/>
          <el-table-column prop="predictSignTime" label="预计签约时间"/>
          <el-table-column label="操作" >
            <template slot-scope="scope">
              <el-button
                size="mini" type="danger" @click="goTableItem(customerSideTable,scope.$index,1)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>

        <div  class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;padding-right:5px;">
          <div class="blue_item"></div>
          <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">生态侧</span>
          <van-button  block type="info" style="display: inline-block;width:auto;height: 33px;" native-type="button" @click="choseZTNL(2,'生态侧')">新增</van-button>
        </div> 
        <el-table  :data="ecologicalSideTable" border style="width: 100%">
          <el-table-column prop="modifier" label="维护人"/>
          <el-table-column prop="modifiedTime" label="维护时间"/>
          <el-table-column prop="roleNew" label="岗位角色"/>
          <el-table-column prop="tenderingAgency" label="招标代理机构名称"/>
          <el-table-column prop="ecologicalRelation" label="生态商业关系评价"/>
          <el-table-column prop="ecologicalRecord" label="生态商业动态记录"/>
          <el-table-column label="操作" >
            <template slot-scope="scope">
              <el-button
                size="mini" type="danger" @click="goTableItem(ecologicalSideTable,scope.$index,2)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>

        <div  class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;padding-right:5px;">
          <div class="blue_item"></div>
          <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">竞争侧</span>
          <van-button  block type="info" style="display: inline-block;width:auto;height: 33px;" native-type="button" @click="choseZTNL(3,'竞争侧')">新增</van-button>
        </div> 
        <el-table  :data="competitiveSideTable" border style="width: 100%">
          <el-table-column prop="modifier" label="维护人"/>
          <el-table-column prop="modifiedTime" label="维护时间"/>
          <el-table-column prop="roleNew" label="岗位角色"/>
          <el-table-column prop="competeAbility" label="项目经验能力评价"/>
          <el-table-column label="操作" >
            <template slot-scope="scope">
              <el-button
                size="mini" type="danger" @click="goTableItem(competitiveSideTable,scope.$index,3)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>

        <div  class="mt10" style=" display: flex;border-bottom: 1px solid #ebedf0;padding-right:5px;">
          <div class="blue_item"></div>
          <span class="font15" style="display: flex; line-height: 33px;margin-left:5px;  flex:1;">移动侧</span>
          <van-button  block type="info" style="display: inline-block;width:auto;height: 33px;" native-type="button" @click="choseZTNL(4,'移动侧')">新增</van-button>
        </div> 
        <el-table  :data="movingSideTable" border style="width: 100%; padding-bottom: 45px;">
          <el-table-column prop="modifier" label="维护人"/>
          <el-table-column prop="modifiedTime" label="维护时间"/>
          <el-table-column prop="roleNew" label="岗位角色"/>
          <el-table-column prop="relationEvaluation" label="我司商业关系评价"/>
          <el-table-column prop="ourAbility" label="项目经验能力评价"/>
          <el-table-column label="操作" >
            <template slot-scope="scope">
              <el-button
                size="mini" type="danger" @click="goTableItem(movingSideTable,scope.$index,4)">查看</el-button>
            </template>
          </el-table-column>
        </el-table>
       
        <van-popup v-model="showPop" position="bottom" get-container="body">
            <van-picker show-toolbar value-key="name" :columns="busiOpportSource"
                @confirm="milestoneNodeClickConfirm" @cancel="showPop = false">
            </van-picker>
        </van-popup>

        <div class="footer">
          <van-button block type="info" native-type="submit" :disabled="params.businessStatus=='关闭'"
            style="display: inline-block;width:100%;border: 15px solid #60a9ec;">{{ params.businessStatus=='关闭'?'关闭状态禁止保存':'保存' }}
          </van-button>
        </div>
      </van-form>
</template>

<script>
import {getSrqrRequest} from '@/api/dictapi'
import {mapGetters} from "vuex"
import { Notify,Dialog, Toast } from 'vant'
import util from "@/assets/js/public";
import myvan_field from '@/components/myvanfield';
  export default {
    components:{
      myvan_field
    },
    data() {
      return {
        fromdata:{},//表单数据
        customerSideTable:[],
        ecologicalSideTable:[],
        competitiveSideTable:[],
        movingSideTable:[],
        busiOpportSource:[],//数据字典
        showPop:false,
        params:this.$route.query
      }
    },
    computed:{
        ...mapGetters(['user']),
        ...mapGetters(['userinfo'])
    },
    //生命周期--创建完成
    activated() {
      this.params=this.$route.query
      if(!this.fromdata||Object.keys(this.fromdata).length === 0){
        this.getdetail();
      }
      //检查本地缓存是否有选择数据，有的话直接刷新
      let typeValue =localStorage.getItem('bus_refresh_table');
      if(typeValue){
        this.getAllTableData(typeValue);
        localStorage.removeItem('bus_refresh_table');
      }
    },
    beforeRouteLeave(to, from, next) {
      if(to.name=="drawup_transition_tab"){//返回列表需要清空数据
          this.fromdata={}
          this.customerSideTable=[]
          this.ecologicalSideTable=[]
          this.competitiveSideTable=[]
          this.movingSideTable=[]
          this.busiOpportSource=[]
          this.showPop=false
      }
    next();
  },
  
    //方法调用
    methods: {
        choseZTNL(type,title){ 
          this.$router.push(
            {
              name: 'sjwhaddTable',
              params: {
                "title":"新增"+title,
                "businessId":this.params.businessId,
                "type":type,
              }
            }
          );
        },
        goTableItem(list,index,type) { //delete from data
          this.$router.push(
            {
              name: 'sjwhaddTable',
              params: {
                "title":"查看",
                "type":type,
                "datas":list[index]
              }
            }
          );
        },
        milestoneNodeClickConfirm (value) {
          this.showPop = false;
          this.fromdata.busiOpportSource = value.value;
        },
        getKeyFromDictionaryByValue(value,mapArray){
          const mapObject = mapArray.reduce((acc, item) => ({ ...acc, [item.value]: item.name }), {});
          return mapObject[value] || ""; 
        },
        getdetail(){
          Toast.loading({
              message:'加载中',
              forbidClick:false
          });
          getSrqrRequest("queryDictValue$api$queryByType",{
              kv: {
                "source": 'MOBILE',
                "dictType":"busiOpportSource",
                "currentUserCode": util.encrypt(this.user.userName),
              }
            })
            .then((result)=>{
              if(result.responseid==1){//请求成功
                  this.busiOpportSource=result.data.data;
                  this.getFormData();
              }else{
                Toast.clear();
                Notify(result.message);
              }
                  
            })
            .catch(() => { Toast.clear();});
        },
        getFormData(){
          getSrqrRequest("businessMaintain$api$getBusinessMaintainByBusinessId",{
            kv: {
              "source": 'MOBILE',
              "businessId":this.params.businessId,
              "currentUserCode": util.encrypt(this.user.userName),
            }
          })
          .then((result)=>{
                  Toast.clear();
                  if(!result.data){
                      Notify(result.message);
                      return;
                  }
                  if(result.data.data){
                    this.fromdata=result.data.data;
                    this.getAllTableData("customerSide");
                    this.getAllTableData("ecologicalSide");
                    this.getAllTableData("competitiveSide");
                    this.getAllTableData("movingSide");
                  }
              })
          .catch(() => { Toast.clear();});
        },
        getAllTableData(typeValue){
          getSrqrRequest("businessMaintainLog$api$querySideByBusinessId",{
            kv: {
              "type": typeValue,
              "source": 'MOBILE',
              "page": 1,
              "rows": 1000,
              "size": 1000,
              "businessId":this.params.businessId,
              "currentUserCode": util.encrypt(this.user.userName),
            },
            body:{
              "page": 1,
              "rows": 1000,
              "size": 1000,
            }
          }).then((result)=>{
              if(result.data.data){
                switch(typeValue){
                  case "customerSide":
                    this.customerSideTable=result.data.data.content;
                    break;
                  case "ecologicalSide":
                    this.ecologicalSideTable=result.data.data.content;
                    break;
                  case "competitiveSide":
                    this.competitiveSideTable=result.data.data.content;
                    break;
                  case "movingSide":
                    this.movingSideTable=result.data.data.content;
                    break;
                }
              }
            })
        },
        changeFromData(){ //提交流转
          Toast.loading({
              message:'加载中',
              forbidClick:false
          });
          getSrqrRequest("businessMaintain$api$saveBusinessMaintainInfo",{
              "kv": {
                "source": 'MOBILE',
                "currentUserCode": util.encrypt(this.user.userName),
              },
              "body": {
                "maintainInfoMap":{
                  "busiOpportSource":this.fromdata.busiOpportSource,
                  "businessId":this.fromdata.businessId,
                  "businessName":this.fromdata.businessName,
                  "businessStatus":this.fromdata.businessStatus,
                  "changeReason2":this.fromdata.changeReason2,
                  "city":this.fromdata.city,
                  "cityCode":this.fromdata.cityCode,
                  "clueName":this.fromdata.clueName,
                  "county":this.fromdata.county,
                  "countyCode":this.fromdata.countyCode,
                  "customerCode":this.fromdata.customerCode,
                  "customerName":this.fromdata.customerName,
                  "id":this.fromdata.businessMaintain.id,
                  "industryType":this.fromdata.industryType,                  
                  "preAmount":this.fromdata.preAmount,
                  "projectDesc":this.fromdata.projectDesc
                }
              }
            }) .then((result)=>{
                  Toast.clear();
                  if(result.responseid==1){//请求成功
                    this.$router.go(-1);
                  }else{
                    Notify(result.message);
                  }
            })
            .catch(() => { Toast.clear();});
        }
    }
  }
</script>
<style  scoped>
/* @import url();*/
</style>